<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <th:block th:replace="include/css"/>
    <link rel="stylesheet" type="text/css" href="/static/css/ask_detail.css">
    <link rel="stylesheet" href="/static/ueditor/third-party/SyntaxHighlighter/shCoreDefault.css">
    <th:block th:replace="include/top"/>
    <title th:text="${ask.title}"></title>
</head>
<body>
<th:block th:replace="include/header:: header"/>

<div class="main">
    <div class="navigation">
        <a href="/ask">问答</a>&nbsp;&gt;&nbsp;

        <a href="/ask?solveType=1" th:if="${!#strings.isEmpty(ask.bestAnswerId)}">已解决问题&nbsp;&gt;&nbsp;</a>

        <a href="/ask" th:if="${#strings.isEmpty(ask.bestAnswerId)}">待解决问题&nbsp;&gt;&nbsp;</a>

        <span th:text="${ask.title}"></span>
    </div>

    <div class="arc-shadow">
        <div class="topic-info-con">
            <div class="topic-icon"><a th:href="'/user/'+ ${ask.userId}"><img class="img-circle"
                                                                              th:src="'/static/images/'+${ask.userIcon}"></a>
            </div>
            <div class="topic-info">
                <div class="topic-title">
                    <a th:href="'/ask/'+${ask.askId}" class="title" th:text="${ask.title}"></a>
                    <span class="time" th:text="${#temporals.format(ask.createTime,'yyyy-MM-dd HH:mm:ss')}"></span>
                </div>
                <div class="topic-info-d topic-count-info">
                    <a th:href="'/ask/'+${ask.askId}" class="user-info">
                        <i class="icon icon-user-name"></i>
                        <span th:text="${#temporals.format(ask.createTime,'yyyy-MM-dd HH:mm:ss')}"></span></a>
                    <span class="count">
                        <i class="icon icon-mark"></i><span th:text="'赏分：'+${ask.mark}"></span></span>

                    <span class="count"><i class="icon icon-read"></i><span
                            th:text="'阅读：'+${#strings.defaultString(ask.readCount,'0')}"></span></span>
                    <span class="count"><i class="icon icon-comment" data-garbage="true"></i><span>评论：
                        <span id="comment-count" th:text="${#strings.defaultString(ask.commentCount,0)}"></span></span></span>
                    <span class="count"><i class="icon icon-like"></i><span>喜欢：
                        <span
                                id="like-count" th:text="${#strings.defaultString(ask.likeCount,0)}"></span></span></span>
                    <span class="count"><i class="icon icon-collection"></i><span
                    >收藏：<span
                            id="collection-count" th:text="${#strings.defaultString(ask.collectionCount,0)}"></span></span></span>
                </div>
            </div>
            <div class="clear"></div>
        </div>
        <div class="topic-detail" th:utext="${ask.content}">
        </div>

        <div class="best-answer" th:if="${!#lists.isEmpty(ask.bestAnswer)}">
            <div class="best-answer-title">提问者采纳</div>
            <div class="comment-item">
                <div class="comment-panel">
                    <div class="user-icon">
                        <a th:href="'/user/'+${ask.bestAnswer.userId}">
                            <img th:src="'/static/images/'+${ask.bestAnswer.userIcon}"></a>
                    </div>
                    <div class="comment-con">
                        <div class="content_detail">
                            <a id="user-name-5667" th:href="'/user/'+${ask.bestAnswer.userId}"
                               th:text="${ask.bestAnswer.userName}"></a>
                            <span>
                        <p>已解决</p>
                        </span>
                        </div>
                        <div class="time-op">
                            <span class="time" th:text="${#temporals.format(ask.bestAnswer.createTime,'yyyy-MM-dd HH:mm:ss')}"></span>
                            <!--                            ,${data-comment-id=ask.bestAnswer.id}"-->
                            <a href="javascript:;" th:attr="pid=${ask.bestAnswer.id}" class="comment-btn"><i
                                    class="icon icon-re"></i>回复</a>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="child-panel">
                    <div class="comment-panel" th:if="${!#lists.isEmpty(ask.bestAnswer.children)}"
                         th:each="item:${ask.bestAnswer.children}">
                        <div class="user-icon">
                            <a th:href="'/user/'+${item.userId}"><img th:src="'/static/images/'+${item.userIcon}"></a>
                        </div>
                        <div class="comment-con">
                            <div class="content_detail">
                                <a th:id="'user-name-'+${item.id}" th:href="'/user/'+${item.userId}"
                                   th:text="${item.userName}"></a>：
                                <span th:text="${item.showContent}"></span>
                            </div>
                            <div class="time-op">
                                <span class="time" th:text="${#temporals.format(item.createTime,'yyyy-MM-dd HH:mm:ss')}"></span>
                                <a href="javascript:;" th:attr="pid=${ask.bestAnswer.id,comment-id=item.id}"
                                   class="comment-btn"><i class="icon icon-re"></i>回复</a>
                            </div>
                        </div>
                        <div class="clear"></div>
                    </div>
                </div>
                <div class="comment-form" th:id="'comment-form-'+${ask.bestAnswer.id}">
                    <div class="subcomment-form-textarea">
                        <textarea></textarea>
                    </div>
                    <div class="comment-form-op">
                        <a href="javascript:;" title="@好友" class="op-at"> <i class="icon icon-op-at"></i>
                        </a>
                        <a href="javascript:;" title="插入表情" class="op-emotion">
                            <i class="icon icon-op-emotion"></i>
                        </a>
                        <a href="javascript:;" class="btn btn-info reply" th:attr="pid=${ask.bestAnswer.id}">回复</a>
                    </div>
                </div>
            </div>
        </div>
        <th:block th:replace="include/comment"/>
    </div>
</div>

<th:block th:replace="include/footer:: footer"/>
<script src="/static/ueditor/third-party/SyntaxHighlighter/shCore.js"></script>
<script src="/static/js/ask_detail.js"></script>
<script th:inline="javascript">
    SyntaxHighlighter.all();
    fzqblog.topicId = [[${ask.askId}]];
    fzqblog.articleType = "A";
    fzqblog.bestAnswerId = [[${ask.bestAnswerId}]];
    fzqblog.articleTitle = [[${ask.title}]];
    fzqblog.articleUserId = [[${ask.userId}]];
</script>


</body>
</html>